<template>

  <div class="dashboard-editor-container" style="padding:0px;">

    <el-row :gutter="12" style="padding:6px 0 0 0;margin-bottom:0px;border-style: none; " >
      <!-- 图片部分-->
    <div class="clearfix d1" >
      <div class=" z1" >
        <el-image
          style="width: 100%;  height: 79px ; "
          :src="require('@/assets/images/15.png')">

        </el-image>
      </div>
      <div  class=" y1">

        <el-menu
          :default-active="activeIndex2"
          class="el-menu-demo"
          mode="horizontal"
          @select="handleSelect"
          background-color="#30303c"
          text-color="whitesmoke"
          active-text-color="whitesmoke"
          style="height: 80px;width: 100%"
        >
          <el-menu-item index="1" style="height: 80px; padding: 10px 50px 0 50px ;">
            <span style="font-size: 20px; color: whitesmoke; "><b>首页</b></span>
          </el-menu-item>
          <el-submenu index="2" style="height: 80px; padding: 10px 50px 0 50px ;">
            <template slot="title" style="height: 80px; padding: 10px 50px 0 50px ;">
              <span style="font-size: 20px; color: whitesmoke"><b>成果管理</b></span>
            </template>
            <el-menu-item index="2-1">
              <span style="font-size: 20px; color: whitesmoke"><b>首页</b></span>
            </el-menu-item>
            <el-menu-item index="2-2">
              <span style="font-size: 20px; color: whitesmoke"><b>首页</b></span>
            </el-menu-item>
            <el-menu-item index="2-3">
              <span style="font-size: 20px; color: whitesmoke"><b>首页</b></span>
            </el-menu-item>

          </el-submenu>
          <el-submenu index="3" style="height: 80px; padding: 10px 50px 0 50px ;">
            <template slot="title" style="height: 80px; padding: 10px 50px 0 50px ;">
              <span style="font-size: 20px; color: whitesmoke"><b>成果转化</b></span>
            </template>
            <el-menu-item index="2-1">
              <span style="font-size: 20px; color: whitesmoke"><b>首页</b></span>
            </el-menu-item>
            <el-menu-item index="2-2">
              <span style="font-size: 20px; color: whitesmoke"><b>首页</b></span>
            </el-menu-item>
            <el-menu-item index="2-3">
              <span style="font-size: 20px; color: whitesmoke"><b>首页</b></span>
            </el-menu-item>

          </el-submenu>
          <el-submenu index="4" style="height: 80px; padding: 10px 50px 0 50px ;">
            <template slot="title" style="height: 80px; padding: 10px 50px 0 50px ;">
              <span style="font-size: 20px; color: whitesmoke"><b>合同管理</b></span>
            </template>
            <el-menu-item index="2-1">
              <span style="font-size: 20px; color: whitesmoke"><b>首页</b></span>
            </el-menu-item>
            <el-menu-item index="2-2">
              <span style="font-size: 20px; color: whitesmoke"><b>首页</b></span>
            </el-menu-item>
            <el-menu-item index="2-3">
              <span style="font-size: 20px; color: whitesmoke"><b>首页</b></span>
            </el-menu-item>

          </el-submenu>
          <el-submenu index="5" style="height: 80px; padding: 10px 50px 0 50px ;">
            <template slot="title" style="height: 80px; padding: 10px 50px 0 50px ;">
              <span style="font-size: 20px; color: whitesmoke"><b>费用管理</b></span>
            </template>
            <el-menu-item index="2-1">
              <span style="font-size: 20px; color: whitesmoke"><b>首页</b></span>
            </el-menu-item>
            <el-menu-item index="2-2">
              <span style="font-size: 20px; color: whitesmoke"><b>首页</b></span>
            </el-menu-item>
            <el-menu-item index="2-3">
              <span style="font-size: 20px; color: whitesmoke"><b>首页</b></span>
            </el-menu-item>

          </el-submenu>


        </el-menu>





      </div>
      <div class=" y2">
        <el-button class="an2" >登录</el-button>
        <el-button class="an2" >注册</el-button>

      </div>

    </div>





    </el-row>
    <el-row :gutter="12" style="padding:0 6px 0 0;margin-bottom:16px; " >
      <!-- 图片部分-->

      <el-card class="box-card bj" shadow="hover" >

        <div  class="clearfix">
          <div style="padding:50px 0 0 80px;">
            <span style="font-size: 30px; color: whitesmoke"><b>科技成果</b></span>
          </div>
          <div style="padding:20px 0 0 80px;">
            <span style="font-size: 22px; color: whitesmoke"><b>建设知识产权运营体系，构筑科技成果聚集高地</b></span>
          </div>

          <el-input style="padding:60px 0 0 80px; " type="primary" class="sousuo" v-model="input" placeholder="请输入关键词进行检索" clearable></el-input>
          <el-button class="an1" >搜索</el-button>






        </div>
        <div  class="clearfix" style="padding:83px 0 0 80px;">

          <span style="font-size: 20px; color: whitesmoke"><b>首页·科技成果</b></span>

        </div>

      </el-card>


    </el-row>

    <el-row :gutter="12" style="padding:0 175px 0 175px;margin-bottom:16px; ">

      <el-card style=" border-style: solid; border-color: lightblue;" class="box-card" shadow="always ">
        <div style="padding:0 0 0 0;margin-bottom:16px;height: 60px" >
          <div >
            <el-tabs v-model="activeName" @tab-click="handleClick">
              <el-tab-pane label="筛选条件：" name="first"></el-tab-pane>
              <el-tab-pane label="成果类别 >" name="second">
                <el-button class="sx">发明专利</el-button>
                <el-button class="sx">实用新型（设计）专利</el-button>
                <el-button class="sx">软件著作权</el-button>
                <el-button class="sx">科技成果鉴定</el-button>
                <el-button class="sx">成熟的设想</el-button>
                <el-button class="sx">其他</el-button>
              </el-tab-pane>
              <el-tab-pane label="成果类型 >" name="third">
                <el-button class="sx">创新训练项目</el-button>
                <el-button class="sx">创业训练项目</el-button>
                <el-button class="sx">创业实践项目</el-button>
              </el-tab-pane>


              <el-tab-pane label="成果等级 >" name="fourth">
                <el-button class="sx">国家级</el-button>
                <el-button class="sx">省级</el-button>
                <el-button class="sx">校级</el-button>
                <el-button class="sx">院级</el-button>
              </el-tab-pane>

              <el-tab-pane label="技术领域 >" name="five">
                <el-button class="sx">新能源</el-button>
                <el-button class="sx">新兴信息产业</el-button>
                <el-button class="sx">节能环保</el-button>
                <el-button class="sx">高端装备制造业</el-button>
                <el-button class="sx">生物产业</el-button>
                <el-button class="sx">新医药</el-button>
                <el-button class="sx">新化工</el-button>
              </el-tab-pane>
            </el-tabs>
          </div>

        </div>
      </el-card>
    </el-row>
    <el-row :gutter="12" style="padding:0 175px 0 175px;margin-bottom:16px;">
      <!-- 展示-->
      <el-card style=" border-style: solid; border-color: lightblue;" class="box-card" shadow="always ">
        <div  class="big_box" >

          <div  class="z" >
            <el-image
              style="width: 100%;  height: 280px"
              :src="require('@/assets/images/13.png')">

            </el-image>

          </div>
          <div  class="c"></div>
          <div  class="y" >

            <div  style="width: 100%;height: 20px">
              <h2 ><b>一种基于零中频解调原理的频率特性测试仪</b></h2>

            </div>
            <div  style="width: 100% " >
              <el-descriptions :column="3" style="font-size: 16px">
                <template slot="extra" >
                  <el-button type="primary" class="an">展示详情</el-button>
                </template>
                <el-descriptions-item label="负责人姓名">张三</el-descriptions-item>
                <el-descriptions-item label="负责人专业">软件工程</el-descriptions-item>
                <el-descriptions-item label="负责人年级">2020级</el-descriptions-item>
                <el-descriptions-item label="负责人学院">2020级</el-descriptions-item>
                <el-descriptions-item label="成果类型">创新训练项目</el-descriptions-item>
                <el-descriptions-item label="指导教师姓名">李四</el-descriptions-item>
                <el-descriptions-item label="指导教师专业">软件工程</el-descriptions-item>
                <el-descriptions-item label="指导教师职称" :span="2">教师</el-descriptions-item>
                <el-descriptions-item label="成果简介" :span="3">本实用新型公开了一种基于零中频解调原理的频率特性测试仪，其中，信号产生模块与第一A/D采样模块相连，结构简单，成本低廉，不仅能够对LTI系统进行频率特性分析，结构结构简单，成本低廉，不仅能够对LTI系统进行频率特性分析，并且能显示LTI系统的幅频特性和相频特性曲线。</el-descriptions-item>

              </el-descriptions>


            </div>


          </div>


        </div>
      </el-card>
    </el-row>
    <el-row :gutter="12" style="padding:0 175px 0 175px;margin-bottom:16px;">
      <!-- 展示-->
      <el-card style=" border-style: solid; border-color: lightblue;" class="box-card" shadow="always ">
        <div  class="big_box" >

          <div  class="z" >
            <el-image
              style="width: 100%;  height: 280px"
              :src="require('@/assets/images/13.png')">

            </el-image>

          </div>
          <div  class="c"></div>
          <div  class="y" >

            <div  style="width: 100%;height: 20px">
              <h2 ><b>一种基于零中频解调原理的频率特性测试仪</b></h2>

            </div>
            <div  style="width: 100% " >
              <el-descriptions :column="3" style="font-size: 16px">
                <template slot="extra" >
                  <el-button type="primary" class="an">展示详情</el-button>
                </template>
                <el-descriptions-item label="负责人姓名">张三</el-descriptions-item>
                <el-descriptions-item label="负责人专业">软件工程</el-descriptions-item>
                <el-descriptions-item label="负责人年级">2020级</el-descriptions-item>
                <el-descriptions-item label="负责人学院">2020级</el-descriptions-item>
                <el-descriptions-item label="成果类型">创新训练项目</el-descriptions-item>
                <el-descriptions-item label="指导教师姓名">李四</el-descriptions-item>
                <el-descriptions-item label="指导教师专业">软件工程</el-descriptions-item>
                <el-descriptions-item label="指导教师职称" :span="2">教师</el-descriptions-item>
                <el-descriptions-item label="成果简介" :span="3">本实用新型公开了一种基于零中频解调原理的频率特性测试仪，其中，信号产生模块与第一A/D采样模块相连，结构简单，成本低廉，不仅能够对LTI系统进行频率特性分析，结构结构简单，成本低廉，不仅能够对LTI系统进行频率特性分析，并且能显示LTI系统的幅频特性和相频特性曲线。</el-descriptions-item>

              </el-descriptions>


            </div>


          </div>


        </div>
      </el-card>
    </el-row>
    <el-row :gutter="12" style="padding:0 175px 0 175px;margin-bottom:16px;">
      <!-- 展示-->
      <el-card style=" border-style: solid; border-color: lightblue;" class="box-card" shadow="always ">
        <div  class="big_box" >

          <div  class="z" >
            <el-image
              style="width: 100%;  height: 280px"
              :src="require('@/assets/images/13.png')">

            </el-image>

          </div>
          <div  class="c"></div>
          <div  class="y" >

            <div  style="width: 100%;height: 20px">
              <h2 ><b>一种基于零中频解调原理的频率特性测试仪</b></h2>

            </div>
            <div  style="width: 100% " >
              <el-descriptions :column="3" style="font-size: 16px">
                <template slot="extra" >
                  <el-button type="primary" class="an">展示详情</el-button>
                </template>
                <el-descriptions-item label="负责人姓名">张三</el-descriptions-item>
                <el-descriptions-item label="负责人专业">软件工程</el-descriptions-item>
                <el-descriptions-item label="负责人年级">2020级</el-descriptions-item>
                <el-descriptions-item label="负责人学院">2020级</el-descriptions-item>
                <el-descriptions-item label="成果类型">创新训练项目</el-descriptions-item>
                <el-descriptions-item label="指导教师姓名">李四</el-descriptions-item>
                <el-descriptions-item label="指导教师专业">软件工程</el-descriptions-item>
                <el-descriptions-item label="指导教师职称" :span="2">教师</el-descriptions-item>
                <el-descriptions-item label="成果简介" :span="3">本实用新型公开了一种基于零中频解调原理的频率特性测试仪，其中，信号产生模块与第一A/D采样模块相连，结构简单，成本低廉，不仅能够对LTI系统进行频率特性分析，结构结构简单，成本低廉，不仅能够对LTI系统进行频率特性分析，并且能显示LTI系统的幅频特性和相频特性曲线。</el-descriptions-item>

              </el-descriptions>


            </div>


          </div>


        </div>
      </el-card>
    </el-row>

    <div style="padding:0 175px 0 175px;margin-bottom:16px;text-align: center;" >
      <div class="block">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="currentPage4"
          layout="total, prev, pager, next, jumper"
          :total="400">
        </el-pagination>
      </div>

    </div>



  </div>
</template>

<script>
// import datePanel from "@/components/DatePanel/DatePanel";
import {getUserProfile} from "@/api/system/user";

import userAvatar from "@/views/system/user/profile/userAvatar";
import userInfo from "@/views/system/user/profile/userInfo";
import resetPwd from "@/views/system/user/profile/resetPwd";
import { listNotice, getNotice} from "@/api/system/notice";
import {delMenu, getMenu, listMenu, listMenu1, getRouter, listNormal} from "@/api/library/application/application";
import {getNumber} from "@/api/library/application/application";
import {mapGetters, mapState} from "vuex";
import watermark from "watermark-dom";
import {updateUserProfile} from "@/api/system/user";
import log from "@/views/monitor/job/log";
import { listInner, getInner, delInner, addInner, updateInner } from "@/api/library/msg/inner";

//import Cookies from 'js-cookie'

export default {
  name: "Profile",
  components: { userAvatar, userInfo, resetPwd },
  props: {
    user: {
      type: Object,

    }
  },


  data() {

    return {
      // 遮罩层
      loading: true,
      activeIndex: '1',
      activeIndex2: '1',

      visible: false,

      input: '',
      date:new Date(),
      roleGroup: {},
      froma:{},
      postGroup: {},
      activeTab: "userinfo",
      activeName: 'second',
      cover:"",
      //switch开关初始值
      value:"1",
      //通知公告标题
      titleNotice:"",
      //部门id
      deptId:"",
      //主页链表显示
      categoryList: "",
      activeName1: 'first',
      activeName2:"first",
      menuList: [],
      List:[],
      menuOptions: [],
      List1:[],
      title: "",
      product: "", // 分类列表
      normalList:[],
      contentList: [],
      xiaoxi:{
        // 是否显示弹出层（用户查询）
        open: false,
        // 弹出层标题（用户查询）
        title: "",
      },
      currSelect:1,
      open: false,
      innerList:[],
      rules: {

      },


      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 7,
        noticeType:undefined,
        noticeTitle: undefined,
        createBy: undefined,
        status: 0,
        orderByColumn:"createTime",
        isAsc:"desc"

      },
      handleSelect(key, keyPath) {
        console.log(key, keyPath);
      },
      calendarParams:{
        orderByColumn:"endTime",
        isAsc:"desc"
      },
      messageParams:{
        pageNum: 1,
        pageSize: 6,
        orderByColumn:"createTime",
        isAsc:"desc"
      },

      // 公告表格数据
      noticeList: [],
      // 日程列表
      todayCalendar:[],

      imgwrap:[

        /*   {
             id: "1",
             url: require("../assets/images/news1.jpg"),
             title:"学兵毕业季，一起重温难忘瞬间！"
           },
           {
             id: "2",
             url: require("../assets/images/news2.jpg"),
             title:"学兵毕业季，一起重温难忘瞬间！"
           },
           {
             id: "3",
             url: require("../assets/images/news3.jpg"),
             title:"西部战区空军雷达某旅首届军事体育运动会见闻"
           }*/

      ]
    };

  },
  //去水印
  mounted() {
    // 加载水印
    const username = this.$store.state.user.name;
    watermark.load({ watermark_txt: "  "   });
  },
  //获取头像
  computed: {
    ...mapGetters([

      'avatar',

    ]),

    topNav: {
      get() {
        return this.$store.state.settings.topNav
      }
    },

  },
  created() {

    this.getList();
    this.getUser();
    this.getList1();
    this.getNormal();
    //this.getCalendar();
    this.getMessage();
    /* this.getDate();*/
    /* websockt */
    /*this.wsIsRun = true
    this.wsInit()*/

    /* this.getCulture()*/


    /* 后加的获取外部公告 9/4*/



  },
  watch:{

    activeName:function(val) { //监听切换状态-计划单

      if (val=='first'|| val==null){
        this.List = undefined;
        this.loading = true;
        listNormal().then(response => {
          this.normalList = response.data;
          this.loading = false;
          // console.log(this.normalList+"233");
        });
      }
      else {
        getRouter(val).then(response => {
          this.List1 = response.data;
          window.a=this.List1.path;
          this.loading = false;
          // console.log(this.List1.path+"710")
        });
        getMenu(val).then(response => {
          this.List = response.data;
          this.loading = false;
          // console.log(this.List[0].path+"777")

        })};


      // this.$router.push({path: "/hetong/cjlproject",query: {id: "1", name: "admin"} });


      // 更新地址栏链接，方便刷新页面可以回到原来的页面

    },
    //动态监听swith开关
    /* value:{

       handler(val) {

         if(val=='1'||val == null){


           getUserProfile().then(response => {
             this.user = response.data;
             this.deptId = response.data.deptId;
             this.loading = true;
             if(this.deptId == '101'){

               this.titleNotice = "通知公告"

             }else{
               this.titleNotice = "通知公告(内部公告)"
               this.queryParams.noticeType = val
             }

             listNotice(this.queryParams).then(response => {
               this.noticeList = response.rows;
               this.total = response.total;
               this.loading = false;
             });


           });


         }else {
           this.titleNotice = "通知公告(外部公告)"
           this.queryParams.noticeType = val
           listNotice(this.queryParams).then(response => {
             this.noticeList = response.rows;
             this.total = response.total;
             this.loading = false;
           });
         }

       },
       immediate: true
     },*/
  },

  methods: {


    imgLoad(img){
      try {

        return  require(`../assets/button/`+img)

      } catch (error) {
        return  require(`../assets/button/aaaa.png`)
      }
    },

    close() {
      this.$tab.closePage();
    },


    //应用展示更多
    toURL(){
      this.$router.push({path: "/system/application"});
    },
    //文化宣传详情
    tourlCulture(){
      this.$router.push({path: "/system/application"});
    },

    tableRowClassName({row, rowIndex}) {
      if (rowIndex === 1) {
        return 'warning-row';
      } else if (rowIndex === 3) {
        return 'success-row';
      }
      return '';
    },
    //获取日程
   /* getCalendar(){

      listCalendar(this.calendarParams).then(response => {
        this.loading = true;
        this.todayCalendar  = response.rows;

      })


    },*/

    // 取消按钮
    detailCancel() {
      this.xiaoxi.open = false;
      //   this.getList();
    },

    //文化宣传详情
    culDetail(val){
      console.log(val)
      this.$router.push({
        path: '/dangzheng/culturexiangqing',
        query:{
          id: val,
        }
      })
    },



    //点击公告触发的事件
    handle(row, event, column) {
      // console.log(row)
      this.$router.push({
        path: '/notice/index',
        query:{
          noticeId: row.noticeId,
        }
      })
    },
    //公告显示小手
    cellStyle(data) {

      return "cursor:pointer;text-align:left;"
    },
    indexMethod(index) {
      return index +1;
    },

    handleClick(tab, event) {
      console.log(tab, event);
    },
    /** 查询公告列表 */
    getList() {

      getUserProfile().then(response => {
        this.user = response.data;
        this.deptId = response.data.deptId;
        this.loading = true;

          listNotice(this.queryParams).then(response => {
            this.noticeList = response.rows;
            this.total = response.total;
            this.loading = false;
          });

      })

    },
    getList1() {
      this.loading = true;
      listMenu().then(response => {
        this.contentList = response.data;
        this.loading = false;
      });
    },

    getNormal(){
      this.loading = true;
      listNormal().then(response => {
        this.normalList = response.data;
        this.loading = false;
      });
    },
    getNormalList(item){
      const path =item.path;
      const menuId = item.menuId;
      getNumber(menuId).then(response => {
      });
      this.$router.push({path: "/"+path});
    },
    getLista(item) {
      const path =item.path;
      // console.log(path+"88");
      // const tableName = row.tableName || this.tableNames[0];
      // const params = {pageNum: this.queryParams.pageNum};
      const menuId = item.menuId;
      getNumber(menuId).then(response => {
      });
      this.$router.push({path: "/"+a+"/"+path});
    },


    getUser() {
      getUserProfile().then(response => {
        this.user = response.data;
        this.roleGroup = response.roleGroup;
        this.postGroup = response.postGroup;
        this.deptId = response.data.deptId;

      });
    },

    /** 查询内部消息列表 */
    getMessage() {
      this.loading = true;
      listInner(this.messageParams).then(response => {
        this.innerList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },




    /** 查询文化宣传列表 */
    /*    getCulture() {
          this.loading = true;

          listContent().then(response => {

            let data = response.rows;
            this.total = response.total;
            //重新构造json数组
            for (let i = 0; i < data.length; i++) {

              /!*  var urlPhoto = data[i].note2.replace('/profile','D:/workspaces/ZHXXZH/yinhe-common/src/main/java/com/yinhe/common/file')
                console.log(urlPhoto)*!/
              //如果是在主页上显示 1是展示
              if(data[i].note3=="1"){

                //截取图片名称
                var photo = data[i].note5.split('/')[3]

                //截取路径
                /!*    var url = data[i].note2.replace(photo,'')
                   var realUrl = url.replace('/profile','D:/workspaces/ZHXXZH/yinhe-common/src/main/java/com/yinhe/common/file')
                   console.log(realUrl)*!/

                this.imgwrap.push({
                  id:data[i].id,
                  index:data[i].note4,
                  title:data[i].noticeTitle,
                  url: require('D:/ZHXXZH/yinhe-common/src/main/java/com/yinhe/common/file/upload/'+photo)
                  /!*  url: require(urlPhoto),*!/

                })
              }



            }
          });
        },*/

    /* websockt */
    // 给后台发送消息
    /*sendDataToServer() {
      if (this.webSocket.readyState === 1) {
        this.webSocket.send('来自前端的数据')
      } else {
        throw Error('服务未连接')
      }
    },
    /!**
     * 初始化ws
     *!/
    wsInit() {
      /!* console.log("userName: " + this.name)*!/
      const wsuri = 'ws://127.0.0.1:9900/zhxxzhadmin/wsService/' + this.name
      this.ws = wsuri
      if (!this.wsIsRun) return
      // 销毁ws
      this.wsDestroy()
      // 初始化ws
      this.webSocket = new WebSocket(this.ws)
      // ws连接建立时触发
      this.webSocket.addEventListener('open', this.wsOpenHanler)
      // ws服务端给客户端推送消息
      this.webSocket.addEventListener('message', this.wsMessageHanler)
      // ws通信发生错误时触发
      this.webSocket.addEventListener('error', this.wsErrorHanler)
      // ws关闭时触发
      this.webSocket.addEventListener('close', this.wsCloseHanler)

      // 检查ws连接状态,readyState值为0表示尚未连接，1表示建立连接，2正在关闭连接，3已经关闭或无法打开
      clearInterval(this.wsTimer)
      this.wsTimer = setInterval(() => {
        if (this.webSocket.readyState === 1) {
          clearInterval(this.wsTimer)
        } else {
          console.log('ws建立连接失败')
          this.wsInit()
        }
      }, 3000)
    },
    wsOpenHanler(event) {
      console.log('ws建立连接成功')


    },
    wsMessageHanler(e) {
      console.log('wsMessageHanler')
      console.log(e)
      Cookies.set('unreadNums', '6')
      this.unreadMsgNums = '8'
      this.open1(e)
      //const redata = JSON.parse(e.data)
      //console.log(redata)

    },
    /!**
     * ws通信发生错误
     *!/
    wsErrorHanler(event) {
      console.log(event, '通信发生错误')
      this.wsInit()
    },
    /!**
     * ws关闭
     *!/
    wsCloseHanler(event) {
      console.log(event, 'ws关闭')
      this.wsInit()
    },
    /!**
     * 销毁ws
     *!/
    wsDestroy() {
      if (this.webSocket !== null) {
        this.webSocket.removeEventListener('open', this.wsOpenHanler)
        this.webSocket.removeEventListener('message', this.wsMessageHanler)
        this.webSocket.removeEventListener('error', this.wsErrorHanler)
        this.webSocket.removeEventListener('close', this.wsCloseHanler)
        this.webSocket.close()
        this.webSocket = null
        clearInterval(this.wsTimer)
      }
    },
    /!**
     * 弹窗
     *!/
    open1(e) {
      const h = this.$createElement;
      if(e.data){
        console.log(e.data)
        var data = JSON.parse(e.data)
        /!*if(data){
          //自己展示弹框的封装方法

        }*!/
        /!*this.$notify({
          title: '系统通知提醒',
          message: h('i', { style: 'color: teal'}, e.data)
        });*!/
        /!*this.$notify({
          title: data.msgTitle,
          message: h('i', { style: 'color: teal'}, data.msgContent)
        });*!/
        var route = this.$router;
        var msgType = data.msgType;
        if (msgType=="push") {
          this.$notify.info({
            title: data.msgTitle,
            message: data.msgContent,
            onClick() {
              console.log(route)
              route.push({path: "/msg/list"});
            }
          });
        } else if (msgType == "unread") {
          Cookies.set('unreadNums', data.unreadNums);
          this.$notify.info({
            title: "消息提醒",
            //message: data.msgContent,
            message: "您当前有" + data.unreadNums + "条未读消息，点击此处查看",
            onClick() {
              console.log(route)
              route.push({path: "/msg/list"});
            }
          });
        }

      }
    }*/

    /** 详情操作 */
    getListb(row) {
      const id = row.id || this.ids
      getInner(id).then(response => {
        this.innerList = response.data;
        this.xiaoxi.open = true;
        this.xiaoxi.title = "消息详细";
      });


    }


  },

};
</script>

<style lang="scss" scoped>


.sx{
  border-style: none;
  width: 200px;
  height: 30px;

}

.an1{
  font-size: 22px;
  width: 100px;
  height: 60px;
  color: whitesmoke;
  border-style: none;
  background-color: #0d3e99;
}
.an2{
  font-size: 15px;
  width: 80px;
  height: 40px;
  color: whitesmoke;

  background-color: #30303c;
}

/*背景*/
.bj{
  background-image: url("12.png");
  background-size: 100% 100%;
  height: 400px;

}

/*搜索框*/
.sousuo{
  width: 800px;
  font-size: 22px;

}
::v-deep .el-input__inner{
  height: 60px;
}
.d1{display: flex;height: 80px;scroll-padding: 0}
.z1{
  width: 25%;
  height: 80px;

}
.y1{
  width: 60%;
  height: 80px;

}
.y2{
  padding-top: 22px;
  padding-left: 65px;
  width: 15%;
  height: 79px;
  background-color: #30303c;
}

.big_box{display: flex;height: 280px;}
/*展示左图片*/
.z{
  width: 25%;
  height: 250px;

}
/*展示中空白*/
.c{
  width: 3%;
  height: 250px;
}
/*展示右信息*/
.y{
  width: 70%;
  height: 250px;

}
/*按钮*/
.an{
  height: 30px;
}




.dashboard-editor-container {

  padding: 32px;
  background-color: rgb(240, 242, 245);
  position: relative;

  .chart-wrapper {
    background: #fff;
    padding: 16px 16px 0;
    margin-bottom: 32px;
    padding-left: 30px;
  }

  .el-tabs .el-tabs__content {
    max-height: 100px;
    overflow: auto;
  }

}

@media (max-width:1024px) {
  .chart-wrapper {
    padding: 8px;
  }
}

/* 固定 应用board 宽度; */
.el-tabs--card {
  height: calc(32vh);
  /* overflow-y: auto; */
}

.el-tab-pane {
  height: calc(32vh);
  overflow-y: auto;
  overflow-x: hidden;
}
.tag-style{
  height: 19px;
  color: #116fcf;
  font-family: 黑体;
  font-size: 13px;
  float: right;
  margin-right: 20px;
  line-height:15px;

}
.tag-menu-style{
  height: 19px;
  color: #116fcf;
  font-family: 黑体;
  font-size: 13px;
  float: right;
  margin-right: 0px;
  line-height:15px;
  margin-top: 5px;

}

.bannerimg{
  width: 100%;
  height: inherit;
}
/* 文字样式*/
.carousel-p {
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 25px;
  line-height: 35px;
  text-align: center;
  padding-left: -28px;
  color: white;
  bottom: 66px;
  position: relative;
}
.el-icon-d-arrow-right{
  float: right;
  margin-right: 20px;
  padding-top: 5px;
  font-size:10px !important;
}

.is-selected {
  color: #1989FA;
}


/*日历自定义样式*/
::v-deep .el-calendar__header {
  // 修改头部背景颜色
  background-color: #FFFFFF;
  padding: 3px 5px;
  border: none;
  display: flex;
  justify-content: center;
  margin-top: 35px;

  .el-calendar__button-group {
    // 隐藏原生按钮
    display: none;
  }


  .el-calendar__title {
    // 修改头部标题的字体颜色
    color: #495060 !important;
    font-size: 20px;
    font-weight: bolder;
  }
}

::v-deep .el-calendar__body {
  // 修改主题部分
  padding: 0;
}

::v-deep .el-calendar-table {
  thead {
    th {
      // 修改头部星期部分
      padding: 5px;
      background-color: #2f81d5;
      color: white;
    }
  }

  .is-selected {
    .el-calendar-day {
      p {
        // 选中日期颜色
        color: black;
      }
    }
  }

  .el-calendar-day {
    // 每天小块样式设置
    padding: 0;
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;

    p {
      // 所有日期颜色
      color: black;
      z-index: 1;
      user-select: none;
      display: flex;
    }
  }
}

::v-deep .el-calendar-table__row {
  .prev, .next {
    // 修改非本月
    .el-calendar-day {
      p {
        color: #f0d9d5;
      }
    }
  }

  td {
    // 修改每一个日期td标签
    &:first-child, &:last-child {
      background-color: #f5f5f5;
    }
  }
}

button {
  padding: 3px 10px;
}

//隐藏el-tab-pane滚动条
::v-deep .el-tab-pane {
  height: calc(100vh - 110px);
  overflow-y: hidden;
}


::v-deep .el-scrollbar__wrap {
  overflow-x: hidden!important;


}

::v-deep .-webkit-scrollbar {
  /*隐藏滚轮*/
  display: none;
}
::v-deep.el-table .warning-row {
  background: oldlace;
}

::v-deep.el-table .success-row {
  background: #f0d9d5;
}
.pos1{

  position:absolute;             // 绝对定位,同时规定left和top
  left: 0;
  top:0;
}


//swiitch开关的样式
::v-deep .el-switch__core{
  width:30px!important;
  height:15px;

}
//111
::v-deep .el-tabs__nav-wrap.is-scrollable {
   margin-right: 40px;
   padding: 0 20px;
   -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

::v-deep .el-switch__core::after{
  width:14px;
  height:14px;
  margin-top:-1px;
  margin-bottom: -4px;
}
::v-deep.el-switch.is-checked .el-switch__core::after {
  left: 100%;
  margin-left: -14px;
}

//更改table表中文字的颜色
::v-deep.el-table{
  color: #000000;
}

//日程文字颜色
::v-deep.el-alert--success.is-light {
  background-color: #e7faf0;
  color: #000000;
}
::v-deep.el-alert--success.is-light .el-alert__description {
  color: #507761;
}


/*数字加圈*/
.number_top_circle {
  display: table-cell;
  border-radius: 18px;
  background-color: #4b9dfc;
  width: 25px;
  height: 25px;
  text-align: center;
  vertical-align: middle;
  color: #fff;
}
.number_top_circle_odd {
  display: table-cell;
  border-radius: 18px;
  background-color: #4b9dfc;
  width: 25px;
  height: 25px;
  text-align: center;
  vertical-align: middle;
  color: #fff;
}

//个人中心头像样式
.user-avatar{
  border-radius: 50%;
  height:165px;
  border: 1px solid #409eff;

}
//去掉table表下面的边框线
.el-table__row>td {
  border: none;
}

.el-table::before {
  height: 0px;
}

//纵向分割线
::v-deep.el-divider--vertical{

  height: 10em;
}

.selectBtn{
  background-color: #1482f0;
  color: #ffffff;
}

</style>
<!-- 日历table表的样式-->
<style>




.el-image__error {
  font-size: 10px;

}






.size-icon{
  font-size: 25px;
}

.createInfo th, .createInfo tr {
  background-color: #409eff !important;
  color: #FFFFFF;
  text-align: center;

}
.createInfo tbody tr:hover>td {
  background-color: #409eff !important;
}

/*日期组件绝对定位*/
.main{
  position: relative;

}
.target{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,0%);
}


/*menu中更多按钮*/
.loginOut{
  /* position: absolute;right:23%;top:25px;*/
  position: absolute;right:26%;top:33px;
  color: #e6a23c;
  /*  font-weight: 600;
    font-size: 14px;*/
}
.grid-content{

  padding-left: 0%;
  padding-right: 0%;

}


/* 顶部列表 */
.top-list-image{
  margin-right: 12px;
  font-size: 24px;
  width: 40px;
  padding-top: 0px;
  height: 40px;
  vertical-align: middle;
  text-align: center;
  border-radius:16px;
  color: #fff;
}

.top-list-col{
  height: 100px;
  padding: 10px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  border-radius: 4px;
}

.top-list-span{
  max-width: 4em;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis; /*超出部分用...代替*/
}

</style>
